<template>
    <div class="kind">
        <el-row>
            <el-table :tree-props="{children: 'list'}" row-key="catId" :data="kindData" style="width: 100%" border>
                <el-table-column prop="catName" label="分类名称" align="center">
                </el-table-column>
                <el-table-column label="图标" align="center">
                    <template slot-scope="props">
                        <img :src="props.row.picture" alt="" width="50"/>
                    </template>
                </el-table-column>
                 <el-table-column prop="updateDate" label="修改时间" align="center">
                </el-table-column>
            </el-table>
        </el-row>
        <el-row style="text-align: right;">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[15, 50, 100, 200]"
                :page-size="pageSize"
                layout="->, sizes, prev, pager, next, jumper, total"
                :total="totalElements"
            ></el-pagination>
        </el-row>
        <!-- <noticeDetail :off.sync="noticeDialog" :rowData="rowdata"></noticeDetail> -->
    </div>
</template>


<script>
    import { getShopKind } from "@/api/store/shop.js"
    import * as util from "@/util/util.js"
    export default {
        name: "kind",
        components: {
            
        },
        computed: {
            storeId(){
                return JSON.parse(localStorage.getItem("user")).storeId;
            }
        },
        data(){
            return {
                kindData: [],
                pageSize: 15,
                currentPage: 1,
                totalElements: 0,
                totalPages: 1,
                noticeDialog: false,
                rowdata: {}
            }
        },
        created(){
            this.getList();
        },
        methods: {
            look(row){
                console.log("row", row);
                this.rowdata = row;
                this.noticeDialog = true;
            },
            getList(){
                 getShopKind({
                   storeId: this.storeId
                }).then(
                    res => {
                        console.log("res店铺分类接口", res);
                        let temp = [];
                        this.kindData = res.data;
                        this.kindData.forEach((e) => {
                            e.cats.list = e.list;
                            temp.push(e.cats);
                        });
                        this.kindData = temp;
                        console.log("this.kindData", this.kindData);
                        // this.noticeData.forEach((e) => {
                        //     e.createDate = util.timestampToTime(e.createDate);
                        // });
                        this.totalElements = res.data.total;
                    },
                    err => {}
                );
            },
            //序号
            indexSort(index) {
                if (this.currentPage > 1) {
                    index = (this.currentPage - 1) * this.pageSize + index + 1;
                } else {
                    index = index + 1;
                }
                return index;
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.getList();
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange(val) {
                this.currentPage = val;
                this.getList();
                console.log(`当前页: ${val}`);
            }
        }
    }
</script>
